<template>
  <view>
    <u-navbar :is-back="false" title="设备管理">
      <u-loading slot="loading"></u-loading>
    </u-navbar>

    <view>
      <u-image width="100%" height="300rpx" :src="src"></u-image>
    </view>

    <view class="dataList">
      <view
        class="dataList-item"
        @click="goDetailedM"
        v-for="(item, index) in dataLists"
        :key="index"
      >
        <view  @click="selectM(index)"  :style="{ padding: '1rem' }">
          <img style="width: 3rem" :src="item.img" alt="" />
          <view>{{ item.name }}</view>
        </view>
      </view>
    </view>

    <bar></bar>
  </view>
</template>

<script lang='ts' >
//  import Imgsrc from '@/style/image/equiptment/5f22482c14be1.png'
import { Component, Prop, Vue, Watch, Emit } from "vue-property-decorator";
import bar from "@/pages/home/topbar.vue";



@Component({
  //   @Component  是一个装修器   不可以在下面写语句
  name: "test",
  components: {
    bar,
  },
})
export default class extends Vue {
  @Prop({
    type: String, // 父组件传递给子组件的数据类型
    required: false, // 是否必填
    default: " ", // 默认值， 如果传入的是 Object，则要 default: ()=>({}) 参数为函数
  })
  msg!: string;

  //  public src = Imgsrc
  public src = require('../../style/image/equiptment/5f22482c14be1.png')

  public dataLists = [
    {
      img: require("../../style/image/equiptment/eq0.png"),
      name: "我的设备",
      value: "",
    },
    {
      img: require("../../style/image/equiptment/eq1.png"),
      name: "下级设备",
      value: "",
    },
    {
      img: require("../../style/image/equiptment/eq2.png"),
      name: "掉线设备",
      value: "",
    },
    {
      img: require("../../style/image/equiptment/eq3.png"),
      name: "设备弹出",
      value: "",
    },
    {
      img: require("../../style/image/equiptment/eq4.png"),
      name: "设备报修",
      value: "",
    },
    {
      img: require("../../style/image/equiptment/eq5.png"),
      name: "设备归属",
      value: "",
    },
  ];

  created() {}

  mounted() {
    //  console.log('父组件传递的参数:',this.$parent)   //暂时不考虑
  }
  selectM(index:number){

        console.log('123123123123',index)

   switch(true) {

     case index==0:
          console.log('000')
    uni.navigateTo({
      url: "../equipment/myEquipment",
    });
        break;

     case  index==1:
            uni.navigateTo({
      url: "../equipment/levelEquipment",
    });
        break;

           case  index==2:
          uni.navigateTo({
      url: "../equipment/disconnect",
    });
        break;

           case  index==3:
          uni.navigateTo({
      url: "../../views/sEquiptment/eject",
    });
        break;


           case  index==4:
          uni.navigateTo({
      url: "../equipment/repair",
    });
        break;

          case  index==5:
          uni.navigateTo({
      url: "../equipment/belong",
    });
        break;

     default:
        return 1
        

} 

       
  }

  goDetailedM() {
    // uni.navigateTo({
    //   url: "../equipment/repair",
    // });
  }


}
</script>

<style  scoped>
.dataList {
  display: flex;
  /* justify-content: space-around; */
  flex-wrap: wrap;
}

.dataList-item {
  width: 33.3%;
  text-align: center;
}
</style>